<template>
  <div class="app-main-container">
    <QueryForm v-model="filters" :query-form-config="queryFormConfig" @handleQuery="getList(1)" @clear="clear" />
    <div class="doumee_table_header">
      <el-button v-preventReClick type="primary" @click="tbBtn">同步</el-button>
    </div>
    <el-table
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      border
      fit
      :header-row-class-name="'table-header'"
      class="doumee-element-table"
    >
      <el-table-column align="center" label="模板编码" prop="templateId" min-width="90" show-overflow-tooltip />
      <el-table-column align="center" label="小程序类型" prop="draftType" min-width="90" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.draftType == "0" ? "会员端" : "运营端" }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="迭代版本号" prop="version" min-width="110" show-overflow-tooltip />
      <el-table-column align="center" label="版本状态" min-width="120" prop="status" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ statusName(scope.row.status) }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="版本描述" prop="versoinInfo" show-overflow-tooltip min-width="220" />
      <el-table-column align="center" label="草稿ID" prop="draftId" min-width="100" show-overflow-tooltip />
      <el-table-column align="center" label="创建时间" prop="createTime" min-width="160" show-overflow-tooltip />
      <el-table-column width="1" />
      <el-table-column label="操作" min-width="100" align="center" fixed="right">
        <template slot-scope="scope">
          <div class="flex-cc">
            <el-button v-if="scope.row.status == '0'" type="text" @click="tjBtn(scope.row)">提交</el-button>
            <span v-else>-</span>
          </div>
        </template>
      </el-table-column>
    </el-table>
    <Paginations :total="totalCount" :page="pagination.page" @current-change="getList" @SizeChange="handleSizeChange" />
  </div>
</template>

<script>
import QueryForm from '@/components/QueryForm'
import { queryFormConfig } from './config'
import { parseTime } from '@/utils'
import { getAppVersionList, addToTemplate, syncAppVersion } from '@/api'
export default {
  name: 'EditionyManage',
  components: {
    QueryForm
  },
  data() {
    return {
      filters: {},
      pagination: {
        page: 1,
        rows: 10
      },
      queryFormConfig,
      meta: [],
      list: [],
      totalCount: 10,
      listLoading: false
    }
  },
  created() {
    this.meta = this.$route.meta.buttons || []
    this.getList(1)
  },
  activated() {
    if (this.$route.query.renovate) {
      this.getList(1)
    }
  },
  methods: {
    statusName(status) {
      switch (status) {
        case '0': return '待提交模板库'
        case '1': return '已提交模板库'
        default: return '-'
      }
    },
    getList(page) {
      const { filters, pagination } = this
      if (page) {
        pagination.page = page
        this.pagination.page = Number(page)
        if (page === 1) {
          pagination.firstQueryTime = parseTime(new Date())
        }
      }
      this.listLoading = true
      getAppVersionList({
        pagination,
        param: {
          ...filters
        }
      })
        .then((res) => {
          this.listLoading = false
          if (res.errorCode === '000000') {
            this.list = res.recordList
            this.totalCount = res.totalCount
          }
        })
        .catch(() => {
          this.listLoading = false
        })
    },
    tbBtn() {
      this.$confirm('此操作将同步全部, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.listLoading = true
          syncAppVersion({ param: {}})
            .then(res => {
              this.listLoading = false
              if (res.errorCode !== '000000') return
              this.$message.success('同步成功')
              this.getList(1)
            }).catch(() => {
              this.listLoading = false
            })
        })
        .catch(() => {})
    },
    tjBtn(item) {
      this.$confirm('此操作将提交该版本, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.listLoading = true
          addToTemplate({ param: { draftId: item.draftId, templateType: '0' }})
            .then(res => {
              this.listLoading = false
              if (res.errorCode !== '000000') return
              this.$message.success('提交成功')
              this.getList(1)
            }).catch(() => {
              this.listLoading = false
            })
        })
        .catch(() => {})
    },
    clear() {
      this.filters = {}
      this.getList(1)
    },
    handleSizeChange(value) {
      this.pagination.rows = value
      this.getList(1)
    }
  }
}
</script>

<style></style>
